导航菜单
首页 >  Springboot如何将前端上传的图片保存到resource里的static  > 【SpringBoot】39、SpringBoot上传文件至项目resources目录下

【SpringBoot】39、SpringBoot上传文件至项目resources目录下

大家好,又见面了,我是你们的朋友全栈君。

当我们没有搭建单独的文件服务器时,我们需要将文件上传至项目目录下,今天我们就学习如何上传文件到项目的resources目录下

一、引入依赖代码语言:javascript复制commons-fileuploadcommons-fileupload1.3.3commons-iocommons-io2.6commons-netcommons-net3.3

文件上传,就会涉及到 IO 操作,我们需要引入以上依赖

二、配置文件代码语言:javascript复制spring: # 上传文件 servlet:multipart: max-file-size: 10MB max-request-size: 10MB

配置上传文件的最大值:

spring.servlet.multipart.max-file-size,限制单个文件的最大值spring.servlet.multipart.max-request-size,限制上传的多个文件的总大小三、上传工具类代码语言:javascript复制package com.asurplus.common.utils;import org.apache.commons.lang3.StringUtils;import org.springframework.beans.factory.annotation.Value;import org.springframework.stereotype.Component;import org.springframework.util.ResourceUtils;import org.springframework.web.multipart.MultipartFile;import java.io.File;import java.net.InetAddress;import java.util.UUID;/** * 文件上传 * * @author YangXiuTeng * @date Jun 1, 2015 */@Componentpublic class UploadFileUtil { /** * 项目端口 */@Value("${server.port}")public String port;/** * 项目路径 */@Value("${server.servlet.context-path}")public String contextPath;/** * 上传文件 * * @param multipartFile 文件对象 * @param dir 上传目录 * @return */public ResponseResult uploadFile(MultipartFile multipartFile, String dir) { try { if (multipartFile.isEmpty()) { return ResponseResult.error("请选择文件");}// 获取文件的名称String originalFilename = multipartFile.getOriginalFilename();// 文件后缀 例如:.pngString fileSuffix = originalFilename.substring(originalFilename.lastIndexOf("."));// uuid 生成文件名String uuid = String.valueOf(UUID.randomUUID());// 根路径,在 resources/static/uploadString basePath = ResourceUtils.getURL("classpath:").getPath() + "static/upload/" + (StringUtils.isNotBlank(dir) ? (dir + "/") : "");// 新的文件名,使用uuid生成文件名String fileName = uuid + fileSuffix;// 创建新的文件File fileExist = new File(basePath);// 文件夹不存在,则新建if (!fileExist.exists()) { fileExist.mkdirs();}// 获取文件对象File file = new File(basePath, fileName);// 完成文件的上传multipartFile.transferTo(file);// 返回绝对路径return ResponseResult.success("上传成功", "http://" + InetAddress.getLocalHost().getHostAddress() + ":" + port + contextPath + "/upload/" + fileName);} catch (Exception e) { e.printStackTrace();}return ResponseResult.error("上传失败");}}我们由于需要在工具类中获取项目端口及上下文路径,所以我们使用注解 @Component我们上传的根目录在:resources/static/upload文件名,我们使用了 uuid 作为新的文件名,保证文件不会被覆盖我们返回的路径是绝对路径,在实际的生成环境中,建议使用相对路径ResponseResult 是我们自定义的统一返回对象,表示成功还是失败四、上传调用1、注入上传工具类代码语言:javascript复制@Autowiredprivate UploadFileUtil uploadFileUtil;2、上传 API代码语言:javascript复制/** * 上传文件 *

* Ajax方式上传文件 * * @return */@PostMapping("uploadFileAjax")@ResponseBodypublic ResponseResult uploadFileAjax(HttpServletRequest request) { MultipartHttpServletRequest multiRequest = (MultipartHttpServletRequest) request;MultipartFile file = multiRequest.getFile("files");String dir = request.getHeader("Minio-dir");return uploadFileUtil.uploadFile(file, dir);}3、上传调用

Html

代码语言:javascript复制

ajax提交

JavaScript

代码语言:javascript复制$('#imgUpload').change(function () { var formData = new FormData();formData.append("files", $("#imgUpload")[0].files[0]);var index = layer.load();$.ajax({ type : "POST",cache: false,dataType: "json",data : formData,processData : false,contentType : false,url: baseUrl + 'uploadFileAjax',success:function(res){ layer.close(index);layer.msg(res.msg);if(200 == res.code){ $('#picImg').attr('src',res.data);}},error:function() { layer.close(index);layer.msg("服务器异常!");}});});五、上传测试

点击上传

图片上传成功,转到上传目录:

成功上传至项目的 resources/static/upload/ 目录下

如您在阅读中发现不足,欢迎留言!!!

发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/130856.html原文

相关推荐: